<template>
  <div class="bg-gray">
    <b-container>
      <b-row>
        <b-col>
          <b-breadcrumb class="bg-gray bread-border">
            <b-breadcrumb-item to="/publish">
              <b-icon icon="list-ul" scale="1.25" shift-v="-1.25"/>
              发布列表
            </b-breadcrumb-item>
            <b-breadcrumb-item active>发布详情</b-breadcrumb-item>
          </b-breadcrumb>
        </b-col>
      </b-row>
      <b-row class="justify-content-center align-content-center">
        <b-col cols="12" md="8" class="text-center mb-2">
          <h4 class="text-overflow">{{item.title}}</h4>
        </b-col>
        <b-col cols="12" md="8">
          <h5 class="color-number font-weight-bold">价格：￥{{item.price}}</h5>
          <p class="mb-0">邮费：￥{{item.postage}}</p>
          <hr>
        </b-col>
        <b-col cols="12" md="8">
          <p>{{item.description}}</p>
        </b-col>
        <b-col cols="12" sm="8" md="6" v-for="(fileObject,index) in item.files">
          <b-img :src="genUrl(fileObject.filename)" class="my-1" fluid-grow/>
        </b-col>
        <b-col cols="12" md="8" class="text-right my-3">
          <span >发布于：{{formattime}}</span>
        </b-col>
      </b-row>
    </b-container>
  </div>
</template>

<script>
  import urlconfig from "../urlconfig";

  export default {
    name: "PublishedItem",
    data() {
      return {

        item: '',

      }
    },
    methods: {
      makeToast(msg, res = true) {
        this.$bvToast.toast(msg, {
          title: res ? '操作成功!' : '操作失败！',
          variant: res ? 'primary' : 'danger',
          solid: true,
          autoHideDelay: 5000,
        })
      },


      init() {
        this.$ajax.post('/item/listitem', {itemid: this.$route.params.itemid}).then(resp => {
          let data = resp.data
          if (data.code === 200) {
            this.item = data.data

          } else {
            this.makeToast(data.msg, false)
          }
        }).catch(err => {
          this.makeToast('请求失败', false)
          console.log(err);
        })
      },
      genUrl(filename) {
        return urlconfig.baseUrl + urlconfig.fileResources + filename
      }
    }
    ,
    computed: {
      formattime() {
        let date = new Date(this.item.createtime)
        let year = date.getFullYear()
        let month = date.getMonth()+1
        let day = date.getDate()<10?'0'+date.getDate():date.getDate()
        let hour = date.getHours()<10?'0'+date.getHours():date.getHours()
        let min = date.getMinutes()<10?'0'+date.getMinutes():date.getMinutes()
        let sec = date.getSeconds()<10?'0'+date.getSeconds():date.getSeconds()
        return ''+year+'年'+month+'月'+day+'日'+hour+':'+min+':'+sec
      }
    },
    mounted() {
      this.init()
    }
  }
</script>

<style scoped>
  .max-height {
    max-height: 300px;
    max-width: 100%;
  }
  .text-overflow {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
</style>